<template>
  <div id="sidebar">
    <div class="side-widgets overflow"></div>
  
    <ul class="list-unstyled side-menu"> 
      <template v-for="menu in menus">
        <li class="dropdown active">
          <a class="sa-side-form" href='#'>
            <router-link :to="menu.path">
              <span class="menu-item" style="font-size:16px; font-family:'Microsoft YaHei';">{{ menu.name }}</span>
            </router-link>
          </a>
        </li>
      </template>
    </ul>
  </div>
</template>

<style>
  #sidebar {
    width: 233px;
    float: left;
    background: rgba(0, 0, 0, 0.3);
    height: 100%;
    position: absolute;
  }
</style>

<script>
  import menuConfig from '@/config/menu'


  export default {
    data() {
      return {
        menus: menuConfig
      }
    }
  }
</script>